<template>
  <div class="app-container">
    <eHeader :query="query" ref="eHeader" />
    <!--表格渲染-->
    <el-table
      v-loading="loading"
      :data="data"
      size="small"
      style="width: 100%;"
      highlight-current-row
      @current-change="handleCurrentChange"
    >
      <!--<el-table-column prop="id" label="编号"/>-->
      <!-- <el-table-column prop="eqptsystem" label="所属系统"/> -->
      <!-- <el-table-column prop="eqpttypeid" label="设备类型"/> -->
      <el-table-column prop="eqptcode" label="设备编号" sortable />
      <el-table-column prop="eqptname" label="设备名称" />
      <el-table-column prop="brandname" label="品牌" :formatter="formatBrand" />
      <el-table-column prop="modelname" label="型号" :formatter="formatModel" />
      <!-- <el-table-column prop="serialno" label="设备序列号"/> -->
      <el-table-column prop="location" label="安装位置" />
      <!-- <el-table-column prop="header" label="资产负责人"/> -->
      <!-- <el-table-column prop="headerphone" label="负责人电话"/> -->
      <!-- <el-table-column prop="manufacturer" label="生产厂家"/> -->
      <el-table-column prop="purtime" label="购置时间" :formatter="dateFormat" />
      <!-- <el-table-column prop="supplier" label="供应商"/> -->
      <!-- <el-table-column prop="suppliercontact" label="供应商联系人"/> -->
      <!-- <el-table-column prop="suppliercontactphone" label="供应商联系人电话"/> -->
      <!-- <el-table-column prop="warrantytime" label="质保期限"/> -->
      <!-- <el-table-column prop="eqptdesc" label="备注"/> -->
      <el-table-column prop="customerName" label="所属客户" />
      <el-table-column prop="eqptstate" label="设备状态" />
      <el-table-column
        v-if="checkPermission(['ADMIN','TEQUIPMENT_ALL','TEQUIPMENT_EDIT','TEQUIPMENT_DELETE'])"
        label="操作"
        width="250px"
        align="center"
      >
        <template slot-scope="scope">
          <edit
            v-permission="['ADMIN','TEQUIPMENT_ALL','TEQUIPMENT_EDIT']"
            :data="scope.row"
            :sup_this="sup_this"
          />
          <eqptqrcode
            v-permission="['ADMIN','TEQUIPMENT_ALL','TEQUIPMENT_EDIT']"
            :data="scope.row"
            :sup_this="sup_this"
          />
          <el-popover
            v-permission="['ADMIN','TEQUIPMENT_ALL','TEQUIPMENT_DELETE']"
            :ref="scope.row.id"
            placement="top"
            width="180"
          >
            <p>确定删除本条数据吗？</p>
            <div style="text-align: right; margin: 0">
              <el-button size="mini" type="text" @click="$refs[scope.row.id].doClose()">取消</el-button>
              <el-button
                :loading="delLoading"
                type="primary"
                size="mini"
                @click="subDelete(scope.row.id)"
              >确定</el-button>
            </div>
            <el-button slot="reference" type="danger" icon="el-icon-delete" size="mini" />
          </el-popover>
        </template>
      </el-table-column>
    </el-table>
    <!--分页组件-->
    <el-pagination
      :total="total"
      style="margin-top: 8px; margin-bottom: 12px;"
      layout="total, prev, pager, next, sizes"
      @size-change="sizeChange"
      @current-change="pageChange"
    />
    <el-row>
      <el-card class="box-card">
        <div slot="header" class="clearfix">
          <span>模块信息</span>
          <el-button
            v-if="checkPermission(['ADMIN','DICT_ALL','DICT_CREATE']) && this.$refs.sparepart && this.$refs.sparepart.eqptId"
            class="filter-item"
            size="mini"
            style="float: right;padding: 4px 10px"
            type="primary"
            icon="el-icon-plus"
            @click="$refs.sparepart.$refs.header.$refs.form.dialog = true"
          >新增</el-button>
        </div>
        <sparepart ref="sparepart" />
      </el-card>
    </el-row>
  </div>
</template>

<script>
import checkPermission from "@/utils/permission";
import initData from "@/mixins/initData";
import { del } from "@/api/tEquipment";
import eHeader from "./module/header";
import edit from "./module/edit";
import eqptqrcode from "./module/eqptqrcode";
import sparepart from "../spare/sparepart/index";
export default {
  components: { eHeader, edit, eqptqrcode, sparepart },
  mixins: [initData],
  data() {
    return {
      delLoading: false,
      sup_this: this
    };
  },
  created() {
    this.$nextTick(() => {
      this.init();
    });
  },
  methods: {
    checkPermission,
    beforeInit() {
      this.url = "api/tEquipment";
      const sort = "id,desc";
      this.params = { page: this.page, size: this.size, sort: sort };
      const query = this.query;
      // const type = query.type
      // const value = query.value
      if (query.eqptsystem) {
        this.params["eqptsystem"] = query.eqptsystem;
      }
      if (query.eqpttypeid) {
        this.params["eqpttypeid"] = query.eqpttypeid;
      }
      if (query.eqptname) {
        this.params["eqptname"] = query.eqptname;
      }
      if (query.eqptstate) {
        this.params["eqptstate"] = query.eqptstate;
      }
      if (query.brandname) {
        this.params["brandname"] = query.brandname;
      }
      if (query.customerName) {
        this.params["customerName"] = query.customerName;
      }

      // if (type && value) { this.params[type] = value }
      return true;
    },
    subDelete(id) {
      this.delLoading = true;
      del(id)
        .then(res => {
          this.delLoading = false;
          this.$refs[id].doClose();
          this.init();
          this.$notify({
            title: "删除成功",
            type: "success",
            duration: 2500
          });
        })
        .catch(err => {
          this.delLoading = false;
          this.$refs[id].doClose();
          console.log(err.response.data.message);
        });
    },
    handleCurrentChange(val) {
      if (val) {
        this.$refs.sparepart.eqptId = val.id;
        this.$refs.sparepart.init();
      }
    },
    formatBrand(row, column) {
      var eqptBrandList = this.$refs.eHeader.eqptBrandList;

      for (var brand in eqptBrandList) {
        if (eqptBrandList[brand]["value"] === row["brandname"])
          return eqptBrandList[brand]["label"];
      }
      return row["brandname"];
    },
    formatModel(row, column) {
      var eqptModelnameList = this.$refs.eHeader.eqptModelnameList;
      for (var brand in eqptModelnameList) {
        console.log(eqptModelnameList[brand]["value"], ",", row["modelname"]);
        if (eqptModelnameList[brand]["value"] == row["modelname"])
          return eqptModelnameList[brand]["label"];
      }
      return row["modelname"];
    },
    dateFormat: function(row, column) {
     var t=new Date(row.purtime);//row 表示一行数据, purtime 表示要格式化的字段名称
     // return t.getFullYear()+"-"+(t.getMonth()+1)+"-"+t.getDate()+" "+t.getHours()+":"+t.getMinutes()+":"+t.getSeconds()+"."+t.getMilliseconds();
     return t.getFullYear()+"-"+(t.getMonth()+1)+"-"+t.getDate(); 
    }
  }
};
</script>

<style scoped>
</style>
